﻿<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!doctype html>
<%@include file="/header.jsp" %>
<!--当前位置-->
<div class="width1200 center_yh hidden_yh font14" style="height:40px;line-height:40px;">
	<span>当前位置:</span>
	<a href="../index.html" class="c_66">首页&gt;</a>
	<a href="index.html" class="c_66">个人中心&gt;</a>
	<span>购物车</span>
</div>
<div class="width100 hidden_yh" style="background:#f0f0f0;padding-top:34px;padding-bottom:34px;">
<div class="width1200 hidden_yh center_yh">
<div id="vipNav">
			<a name="content" href="${pageContext.request.contextPath}/member/personal.jsp#content" class="on">账户总览</a>
            <a name="account" href="${pageContext.request.contextPath}/member/account.jsp#account">个人信息</a>
            <a name="order" href="${pageContext.request.contextPath}/member/order.jsp#order">我的订单</a>
            <a name="favorite" href="${pageContext.request.contextPath}/member/favorite.jsp#favorite">商品收藏</a>
            <a name="cart" href="${pageContext.request.contextPath}/member/cart.jsp#cart">我的购物车</a>
            <a name="changepwd" href="${pageContext.request.contextPath}/member/changepwd.jsp#changepwd">修改密码</a>
            <a name="aftersale1" href="${pageContext.request.contextPath}/member/aftersale1.jsp#aftersale1">售后管理</a>
            <a name="address" href="${pageContext.request.contextPath}/member/address.jsp#content">收货地址</a>
</div>
<div id="vipRight">
<!--商品详情-->
<div class="hidden_yh bj_fff" style="width:938px;border:1px solid #ddd;">
	<div class="width100 hidden_yh font24" style="height:60px;line-height:60px;background:#f0f0f0;text-indent:21px;color:#000;font-weight:600;border-bottom:1px solid #ddd;">
		商品详情<font class="red">(2)</font>
	</div>
    <!--列表头部-->
    <div class="width100 hidden_yh font16" style="width:938px;border:1px solid #ddd;">
    	<div class="left_yh tcenter" style="width:40%">商品</div>
        <div class="left_yh tcenter" style="width:14%">价格</div>
        <div class="left_yh tcenter" style="width:14%">数量</div>
        <div class="left_yh tcenter" style="width:14%">小计</div>
        <div class="left_yh tcenter" style="width:14%">操作</div>
    </div>
    <!--具体的商品-->
    <div class="speCific" style="width:938px;border:1px solid #ddd;">
    	<div class="xzWxz" style="width:4%">
        	<b><img src="${pageContext.request.contextPath}/assets/images/xzwxz.png"></b>
        </div>
        <div class="xzSp" style="width:40%">
        	<img src="${pageContext.request.contextPath}/assets/images/02222946404.jpg">
            <div class="xzSpIn">
            	<h3 class="font16 c_33 font100">2017玉石摆件客厅装饰品玄关柜招财工艺品摆设</h3>
                <p class="font13 c_99">颜色:<%String shop_yanse=request.getParameter("shop_yanse"); %> <%=shop_yanse %>  规格:<%String shop_gaodu=request.getParameter("shop_gaodu"); %> <%=shop_gaodu %></p>   
            </div>
        </div>
        <div class="xzJg" style="width:14%">￥<font>268.05</font></div>
        <div class="xzSl" style="width:14%">
        <%int shop_shuliang=Integer.parseInt(request.getParameter("shop_shuliang")); %>
        	<div class="xzSlIn">
            	<b class="Amin">减</b>
                <input type="text" value="<%=shop_shuliang %>"   class="cOnt">
                <b style="border-right:none;border-left:1px solid #ddd;" class="Aadd" onClick="zj(this)">加</b>
            </div>
        </div>
        <div class="xzXj" style="width:14%">￥<font></font></div>   <!-- xzXj  小计中的结算金额 -->
        <div class="xzCz" style="width:14%">
        	<div class="xzCzIn">
            	<a href="javascript:void(0)" class="jRscj">移入收藏夹</a>
                <a href="javascript:void(0)" class="Dels">删除</a>
            </div>
        </div>
    </div>
   
       

</div>
<!--合计-->
<div class="hidden_yh bj_fff" style="height:60px;border:1px solid #ddd;margin-top:40px;">
	<div class="center_yh hidden_yh" style="width:938px;height:60px;margin-left:20px;">
    	<div class="ifAll" style="width:5%">
    		<b><img src="${pageContext.request.contextPath}/assets/images/xzwxz2.png"></b>
    		<font>全选</font>
    	</div>
        <div class="ifDel" style="width:10%">删除</div>
        <div class="ifRemove" style="width:10%">移入收藏夹</div>
        <div class="sXd">
        	<div class="sXd1">已选商品(<font style="color:#cb1c20">0</font>)件</div>
            <div class="sXd2">合计(不含运费):￥<font style="color:#cb1c20" id="zjJg"></font></div>     <!--"zjJg" 最后结算金额的修改 -->>
            <a href="${pageContext.request.contextPath}/member/buy_detail.jsp" class="ifJs">结算</a>
        </div>
    </div>
</div>

</div>
</div>
</div>
<script>
	
(function cx(){
	var e=$(".speCific").length
	for(var a=0;a<e;a++){
		var shuliang=$(".cOnt").val();

		var lt=$(".xzJg").eq(a).find("font").html()
				var zongjia=lt*shuliang;
		zongjia=zongjia.toFixed(2);//总价
		console.info(zongjia);
		
		$(".xzXj").eq(a).find("font").html(zongjia)    //修改xzXj 中的小计   一
		$(".sXd2").eq(a).find("font").html(zongjia)    //修改sXd2    中的小计   一
	}
})();
var es=$(".speCific").length;
$(".xzWxz").click(function(){

	if($(this).hasClass("on")){
		$(this).removeClass("on")
		var ty=$(".xzWxz.on").length;
		
		$(".sXd1").find("font").html(ty);
		
		$(".sXd2").find("font").html(hj); //  全选  中"zjJg"修改最后的结算金额
		if(ty!=es){
			$(".ifAll").removeClass("on")
		}
	}else{
		$(this).addClass("on");   //单个点击选项框
		var hj=$(this).siblings(".xzXj").find("font").html()*1;   //xzXj 表达式    二
		var ty=$(".xzWxz.on").length;
		$(".sXd1").find("font").html(ty);
		$(".sXd2").find("font").html(hj); //单个选择  "zjJg"修改最后的结算金额
		
		if(ty!=es){
			$(".ifAll").removeClass("on")
		}
	}
})
//移入收藏夹
$(".jRscj").click(function(){
	if($(this).hasClass("on")){
		$(this).removeClass("on").html("移入收藏夹")
	}else{
		$(this).addClass("on").html("已收藏")
	}
})	
//删除商品
$(".Dels").click(function(){
	$(this).parent().parent().parent().remove();
})	

$(".Aadd").click(function(){
	var t=$(this).siblings(".cOnt").val()*1;
	var price=$(this).parent().parent().siblings(".xzJg").find("font").html()*1;
	t++;
	$(this).siblings(".cOnt").val(t);
	console.info(t)
	$(this).parent().parent().siblings(".xzXj").find("font").html(sswr(price*t))  //xzXj  增减小计里面的金额   三
	$(".sXd2").find("font").html(sswr(price*t));  //sXd2       结算总金额   三
	//$(this).parent().parent().siblings(".sXd2").find("font").html(sswr(price*t))  //sXd2       结算总金额   三
})
$(".Amin").click(function(){
	var t=$(this).siblings(".cOnt").val()*1;
	var price=$(this).parent().parent().siblings(".xzJg").find("font").html()*1;
	t--;
	console.info(price)
	console.info("假中的"+t)
	$(".sXd2").find("font").html(sswr(price*t));  //sXd2       结算总金额   三

	if(t<1){
		t=1;
		$(".sXd2").find("font").html(sswr(price*t));  //sXd2       结算总金额   三
	}
	$(this).siblings(".cOnt").val(t);
	$(this).parent().parent().siblings(".xzXj").find("font").html(sswr(price*t))    //xzXj  增减小计里面的金额   四
	
})
function sswr(num){
	return(
		num.toFixed(2)
		)
}
$(".ifDel").click(function(){
	$(".xzWxz.on").parent().remove();
})
//全选
$(".ifAll").click(function(){
	if($(".ifAll").hasClass("on")){
		$(this).removeClass("on");
		$(".xzWxz").removeClass("on");
		
		$(".sXd1").find("font").html(0);
	}else{
		$(this).addClass("on");
		$(".xzWxz").addClass("on");
		
		$(".sXd1").find("font").html(es);
	}
})
function zj(obj){
	var zj=$(obj).parent().parent().siblings(".xzXj").find("font").html()*1;    //五
	
	console.log(zj)
}	
</script>
</body>
</html>
